import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';

@Component({
  selector: 'app-first',
  templateUrl: './first.component.html',
  styleUrls: ['./first.component.css']
})
export class FirstComponent implements OnInit {

  id: number;

  constructor(
    private activateRoute: ActivatedRoute,
    private router: Router
  ) { }

  ngOnInit() {
    // 按需求取其中一种方式即可
    // 1.快照方式，仅初始化时生效
    this.id = this.activateRoute.snapshot.params['id'];

    // 2.订阅方式(在当前页，动态修改路由时使用)
    this.activateRoute.params.subscribe(
      (parmas) => {
        this.id = parmas['id'];
      }
    );
  }

  routerTo(id: number) {
    this.router.navigate(['/first', id]);
  }

}
